/**
 * @desc 日志
 */
<template>
    <view class="message" v-if="!isSetting">
        <nut-noticebar text="使用过程有什么问题或者不满意地方积极提意见哦 ..." :background="`rgba(251, 248, 220, 1)`" :color="`#D9500B`">
        </nut-noticebar>
        <nut-textarea v-model="message" placeholder="请输入" />
        <view class="message-btn">
            <nut-button type="primary" @click="submit">确认提交</nut-button>
        </view>
    </view>
    <view v-else>
        <view class="message-list" v-if="messageList.length">
            <view class="message-list-item" v-for="(item, index) in messageList" :key="item._id">
                {{ index + 1 }}.{{ item.message }}</view>
        </view>
        <nut-empty v-else description="无数据"></nut-empty>
    </view>
</template>

<script>
import db from '../../server/index';
import Taro from '@tarojs/taro';
import { adminOpenid } from '../../utils/config'
export default {
    name: 'Message',
    data() {
        return {
            message: '',
            messageList: [],
            isSetting: adminOpenid.includes(Taro.getStorageSync('openid')) // 管理员
        }
    },
    created() {
        this.isSetting && this.init()
    },
    onPullDownRefresh() {
        this.isSetting && this.init()
    },
    methods: {
        submit() {
            if (!this.message) {
                Taro.showToast({
                    title: '反馈内容不能为空!',
                    icon: 'none',
                    duration: 2000,
                    mask: true
                })
                return
            }
            db.collection('message').add({
                data: {
                    message: this.message
                }
            }).then(() => {
                this.message = ''
                Taro.showToast({
                    title: '建议反馈成功，非常感谢！我们会积极处理的。',
                    icon: 'none',
                    duration: 2000,
                    mask: true
                })
            })
        },
        init() {
            Taro.showLoading({
                title: '加载中',
            })
            db.collection('message').get().then(({ data = [] }) => {
                this.messageList = data;
                Taro.stopPullDownRefresh();
                Taro.hideLoading();
            })
        }
    }
}
</script>

<style lang="less">
.message {
    &-btn {
        text-align: center;
        margin-top: 20px;
    }

    &-list {
        &-item {
            padding: 5px 10px;
            font-size: 18px;
        }
    }
}
</style>
